<template>
  <div>
    <keep-alive>
      <component :is="activeCom" @active="active"></component>
    </keep-alive>

  </div>
</template>

<script>
  import scope from './scope.vue'
  import attack from './attack.vue'
  import protect from './protect.vue'

  export default {
    components:{scope,attack,protect},
    data(){
      return{
        activeCom:'scope'
      }
    },
    methods:{
      active(val){
        this.activeCom = val
      }
    }
}
</script>

<style scoped lang="less">
</style>
